<template>
	<view>
		<view style="height: 328rpx;padding:82rpx 30rpx 0;background-image: linear-gradient(to right,#FF4A2B,#FF4141);">
			<view style="color: #fff;display: flex;align-items: center;justify-content: space-between;margin-bottom: 55rpx;">
				<view style="display: flex;align-items: center;">
						<image src="/static/shequ/返回@2x.png" style=" width: 18rpx;height: 32rpx;" mode="aspectFit" @click="backTo()"></image>
					<text style="margin-left: 21rpx;font-size: 32rpx;">购物车</text>
				</view>
				<text style="font-size: 28rpx;">管理</text>
			</view>
		<text style="font-size: 26rpx;color: #fff;">总共4件宝贝</text>
		</view>
		<view style="margin: -150rpx 30rpx 0;width: 690rpx;height: 1260rpx; border-radius: 20rpx 20rpx 0 0; background-color: #fff;">
			
				<view style="display: flex;align-items: center;padding: 40rpx 0 36rpx 20rpx;">
					<checkbox-group >
						<checkbox  value="cb" :checked="state" ></checkbox>
					</checkbox-group>
					<image src="/static/3.1店铺 拷贝@2x.png" style="padding: 0 12rpx 0 42rpx; width: 27rpx;height: 25rpx;margin: ;" mode="aspectFit"></image>
					<text style="font-size: 24rpx;color: #333;">店铺名旗舰店</text>
					<image src="/static/index/返回@2x(1).png" style="width: 12rpx;height: 33rpx;padding-left: 23rpx;" mode="aspectFit"></image>
				</view>
				<view style="display: flex;align-items: center;margin-top: 30rpx;margin-left: 20rpx;">
					<checkbox-group >
						<checkbox class="theme" value="cb" :checked="state" ></checkbox>
					</checkbox-group>
					<image src="" style="margin: 0 25rpx; width: 184rpx;height: 184rpx;border-radius: 10rpx;background-color: #60C9FF;" mode="aspectFill"></image>
					<view style="font-size: 24rpx;width: 350rpx;">
						<text>[精品特卖]商品名称2056-五期商品名称商品名称</text>
						<view style="display: flex;justify-content: space-between;align-items: center;">
							<text>¥10</text>
							<view style="display: flex;">
								<image src="/static/shequ/减@2x.png" :disabled="subState" @click="sub" style="width: 45rpx;height: 44rpx;" mode="aspectFit"></image>
								<text style="width: 40rpx;text-align: center;height: 44rpx;line-height: 44rpx;);">{{num}}</text>
								<image src="/static/shequ/加 (1) 拷贝@2x.png" class="addState" @click="add" style="width: 45rpx;height: 44rpx;" mode="aspectFit"></image>
							</view>
						</view>
					</view>
				</view>
			
			
			
		</view>
		<view style="width: 100%; height: 108rpx;position: fixed;bottom: 0;background-color: #fff;border-top: 1rpx solid #f7f7f7;display: flex;align-items: center;">
			<checkbox-group @change="changeState">
				<checkbox class="theme" style="padding-left: 49rpx;" :checked="alllChecked">全选</checkbox>
			</checkbox-group>
			
			
			<view style="font-size: 28rpx;color: #F61B00;">
				<text>合计：</text>
				<text>¥0.00</text>
			</view>
			<button type="default" style="width: 192rpx;height: 80rpx;border-radius: 40rpx;background-color: #FF4A2B;font-size: 32rpx;color: #fff;">结算</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				num:1,
				shopList:[
					{
						shopName:'店铺名旗舰店',
						src:'',//商品图片路径
						shopTitle:'[精品特卖]商品名称2056-五期商品名称商品名称',//商品标题名称
						price:12,
						checkedNum:1,//已选数量
					}
				],
				state:false
			};
		},
		mounted() {
			this.getShopData()
		},
		methods:{
			changeState(e){
				this.state = !this.state;
				
				// console.log(this.state);
			},
			sub() {
				if (this.num <= 1) {
					this.subState = true;
				} else {
					this.num--;
				}
			},
			add() {
				this.num++;
			},
			getShopData(){
				
				// 获取购物车信息
				this.$request.get(`https://lala.xuanhuabang.site/app/wxapp.php?i=1&v=undefined&m=we7_wmall&c=entry&do=mobile&ctrl=wmall&ac=order&op=cart&ta=index&from=wxapp&state=we7sid-a5da6fcae58ce40bee688fd51e305549&min=0&forceLocation=1&scene=1001&lat=30.65984&lng=104.10194&__lat=30.65984&__lng=104.10194`)
				.then(res => {
					console.log(res.data)
					this.shopList = res.data.list
				});
			},
			deleteShopData(){
				// 删除购物车内商品
				this.$request.get("https://lala.xuanhuabang.site/app/wxapp.php?i=1&v=undefined&m=we7_wmall&c=entry&do=mobile&ctrl=wmall&ac=order&op=cart&ta=truncate&from=wxapp&state=we7sid-a5da6fcae58ce40bee688fd51e305549&sid=2&scene=1001")
				.then(res=>{
					console.log(res);
				})
				
			}
		},
		computed:{
			totelPrice(){
				
			}
		}
	}
</script>

<style lang="scss">
page{
	background-color: #f2f2f2;
}
checkbox .wx-checkbox-input {  
      border-radius: 50%;
}
checkbox .wx-checkbox-input.wx-checkbox-input-checked {
    color: #FFFFFF ;
    background: #FF4732 ;
}


</style>
